<template>
  <div class="stationTransaction">
    <basic-container>
      <avue-crud
        ref="crud"
        :option="option"
        :table-loading="listLoading"
        :data="list"
        :page.sync="page"
        @search-change="handleFilter"
        @selection-change="selectionChange"
        @refresh-change="refreshChange"
        @on-load="getList">
        <template slot="searchMenu" slot-scope="{row,size}">
          <el-button :size="size" @click="()=>{setSearchFiledsEmpty(row);setSearchFiledsEmpty(searchForm);getList()}" icon="el-icon-delete">清空</el-button>
        </template>
        <template slot="menuRight">
          <el-button
            class="filter-item"
            type="primary"
            size="mini"
            @click="exportExcel()">导出
          </el-button>
          <el-button
            class="filter-item"
            type="primary"
            size="mini"
            @click="submitFeedbacks()">提交
          </el-button>
        </template>
        <template slot-scope="scope" slot="menu">
          <!-- <el-button type="text" size="small"  hidden="hidden" v-if="scope.row.stationFile != '[]'" plain @click.stop="download(scope.row,1)">车站附件下载</el-button>
          <el-button type="text" size="small"  hidden="hidden" v-if="scope.row.lineFile != '[]'" plain @click.stop="download(scope.row,2)">线路附件下载</el-button> -->
          <el-button type="text" size="small" plain @click.stop="previewEditor(scope.row,2)">预览</el-button>
          <el-button type="text" size="small" v-if="scope.row.lineStatus==0" plain @click.stop="previewEditor(scope.row,1)">编辑</el-button>
        </template>
      </avue-crud>
    </basic-container>
    <el-dialog
      title="预览"
      :visible.sync="editorDialogVisible"
      width="50%" >
      <template>
        <div style="text-align: center">
          <avue-form v-if="isReload" :option="dialogOption" v-model="formData" :upload-before="uploadBefore" :upload-after="uploadAfter">
            <template slot="returnCreatorName" >
              <el-select :disabled="showType" v-model="username" placeholder="请选择" style="width: 150px" @change="changeLine" filterable>
                <el-option
                  v-for="(item,index) in userList"
                  :key="index"
                  :label="item.username"
                  :value="item.userCode">
                </el-option>
              </el-select>
            </template>
            <template slot="returnCreatorCode">
              <el-input v-model="userCode" disabled="true"></el-input>
            </template>
          </avue-form>
          <avue-crud
            ref="crud"
            :option="optionTwo"
            :data="listTwo">
          </avue-crud>
          <br/>
          <template v-if="!showType">
            <el-button
              style="margin-top: 30px"
              class="filter-item"
              type="primary"
              size="mini"
              @click="submit(1)">确认</el-button>
          </template>
          <el-button
            style="margin-top: 30px"
            class="filter-item"
            type="primary"
            size="mini"
            @click="back()">返回</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script>
  import {getForm, postForm} from '@/api/gen/gen'
  import {mapGetters} from 'vuex';
  import { handleDown } from '@/util/util';
  import {tableOption,getSwStApplyNetworkCheckPassengerAffairs,getSysUserToLine,
    updateSwStApplyNetworkCheckPassengerAffairs,submitFeedback
  } from '../../../../api/subwayRat/conductorDifferences/passengersTransaction/stationTransaction';
  import ElInput from "../../../../../node_modules/element-ui/packages/input/src/input";
  import { setSearchFiledsEmpty,getMappingStatusArray} from "../../../../api/subwayRat/commonCheck";
  import {exportDataToExcel} from "../../../../api/subwayRat/exportSelf";
  import transitUtil from "../../../../api/subwayRat/transitUtil";
  import ElButton from "../../../../../node_modules/element-ui/packages/button/src/button";
  import {handleDownloadZip} from '@/util/util.js';

  export default {
    components: {
      ElButton,
      ElInput},
    name: 'stationTransaction',
    data() {
      return {
        selectKeys:[], //存放对像
        selectKeyVals:[], //存放值
        selectKeyValData: [], //选择数据
        userList : [],
        userCode : '',
        username : '',
        option: tableOption,
        optionTwo: {},
        dialogOption: {},
        formData: {},
        listLoading: true,
        isReload: true,
        editorDialogVisible: false,
        searchForm:{
          lineCode:'',
          stationCode:'',
          lineStatus: '0'
        },
        page: {
          total: 0, // 总页数
          currentPage: 1, // 当前页数
          pageSize: 20, // 每页显示多少条,
          isAsc: false// 是否倒序
        },
        list : [],
        listTwo : [],
        fileType : 0,
        showType : true
      }
    },
    computed: {
    },
    watch: {
    },
    created() {
    },
    methods: {
      submitFeedbacks(){
        let ids = [];
        for (const table of this.selectKeyValData) {
          if (this.validatenull(table.returnData)) {
            this.$message.error("请填写反馈结果再提交！");
            return false;
          }
          if (table.lineStatus != '0') {
            this.$message.error("请选择未提交的数据");
            return false;
          }
          ids.push(table.id);
        }
        this.$confirm("确认提交", "提示", {
            confirmButtonText: "确认",
            cancelButtonText: "取消",
            type: "warning"
          }).then(() => {
            submitFeedback(ids).then((res)=>{
              if(res.data.data==true){
                this.$message.success("操作成功！");
                this.getList();
              }else{
                this.$message.error("操作失败！");
              }
            });
          })
      },
      setSearchFiledsEmpty,
      refreshChange() {
        this.getList()
      },
      uploadBefore(res, done, loading,column) {
          if("stationFile" == column.prop){
            this.fileType = 1;
          }else{
            this.fileType = 2;
          }
          done()
      },
      uploadAfter(res, done, loading,column) {
        done()
        let p = {
          id : this.formData.id
        };
        if(1 == this.fileType){
          p.stationFile = res.fileName
        }else{
          p.lineFile = res.fileName
        }
        updateSwStApplyNetworkCheckPassengerAffairs(p).then((res)=>{
        });
      },
      // download(row,type){
      //     if(1==type){
      //       handleDown(row.stationFile,"zdkj")
      //     }else{
      //       handleDown(row.lineFile,"zdkj")
      //     }
      // },
      download(row,type) {
        let pathList = [];
        if(1==type){
          if (!this.validatenull(row.stationFile)) {
            pathList.push(row.stationFile);
          }
          if (pathList[0] == "[]") {
            this.$message.info("无附件");
            return;
          }
          handleDownloadZip(pathList, "车站附件.zip");
        }else{
          if (!this.validatenull(row.lineFile)) {
            pathList.push(row.lineFile);
          }
          if (pathList[0] == "[]") {
            this.$message.info("无附件");
            return;
          }
          handleDownloadZip(pathList, "线路附件.zip");
        }

      },
      send(type){
        if(this.selectKeyVals.length<=0){
          this.$message.warning("请选择一条数据操作！");
          return;
        }
        let p = {
          ids : JSON.stringify(this.selectKeyVals),
          lineStatus : type
        };
        updateSwStApplyNetworkCheckPassengerAffairs(p).then((res)=>{
          if(res.data.code==0){
            this.$message.success("操作成功！");
            this.getList();
          }else{
            this.$message.error("操作失败！");
          }
        });
      },
      async exportExcel(){ // 导出
        let p={};
        Object.assign(p,this.searchForm);
        p.pageNo=1;
        p.pageSize=1000000000;
        p.size=1000000000;
        if(this.selectKeys.length>0){
          let newData = JSON.parse(JSON.stringify(this.selectKeys));
          exportDataToExcel(newData,this.option.column,'车站提交事务协查申请审核');
        }else {
          let res=await getSwStApplyNetworkCheckPassengerAffairs(p);
          let data = res.data.data.records;
          exportDataToExcel(data,this.option.column,'车站提交事务协查申请审核');
        }
      },
      submit(type){
          let p = {
            id : this.formData.id,
            returnCreatorName : this.username,
            returnCreatorCode : this.userCode,
            returnData : this.formData.returnData,
            lineFile: this.formData.lineFile
          };
        updateSwStApplyNetworkCheckPassengerAffairs(p).then((res)=>{
            if(res.data.code==0){
              this.$message.success("操作成功！");
              this.getList();
            }else{
              this.$message.error("操作失败！");
            }
          });
          this.editorDialogVisible = false;
      },
      changeLine(row){
          this.userCode = row;
      },
      back(){
          this.editorDialogVisible = false;
      },
      async previewEditor(row,type){
        if(1 == type){//编辑
          this.showType = false;
          let resp =await getSysUserToLine({});
          this.userList = resp.data.data;
          this.username = this.$store.getters.userInfo.username;
          this.userCode = this.$store.getters.userInfo.userCode;
        }else{//预览
          this.showType = true;
          this.username = row.returnCreatorName;
          this.userCode = row.returnCreatorCode;
        }
        this.getOption(type);
        this.listTwo = [];
        this.listTwo.push(row);
        Object.assign(this.formData,row);
        this.editorDialogVisible = true;
      },
      getOption(type){
        this.optionTwo = {
          border: true,
          index: false,
          menu: false,
          indexLabel: '序号',
          stripe: true,
          menuAlign: 'center',
          viewBtn: false,
          editBtn: false,
          delBtn: false,
          emptyBtn:false,
          align: 'center',
          selection: false,
          reserveSelection:false,
          addBtn: false,
          column: [{
            label: '设备类型',
            prop: 'deviceType',
            formatter:function(row, value , label, column){
		 if(value!="" && value!='undefined' && value!=undefined){
		    return value == 1?'BOM':'TVM';
		  }
		  return "";
	    },
	    dicData: [{
	      label: '',
	      value: ''
	    },{
	      label: 'TVM',
	      value: '0'
	    }, {
	      label: 'BOM',
	      value: '1'
	    }],
            search: false,
            hide: false
          }, {
            label: '设备编号',
            prop: 'deviceNo',
            search: false,
            hide: false,
          }, {
            label: '卡号',
            prop: 'cardNumber',
            search: false,
            hide: false,
          }, {
            label: '票种',
            prop: 'ticketType',
            type: 'select',
            formatter:function(row, value , label, column){
	      if(value!="" && value!='undefined' && value!=undefined){
		     return value == 1?'其他票种':'长安通';
		  }
		  return "";

	    },
	    dicData: [{
	      label: '',
	      value: ''
	    },{
	      label: '长安通',
	      value: '0'
	    }, {
	      label: '其他票种',
	      value: '1'
	    }],
            search: false,
            hide: false,
          }, {
            label: '其他票种',
            prop: 'otherTicketName',
            search: false,
            hide: false,
          }, {
            hide: false,
            label: '开始时间',
            prop: 'beginTime',
            format: 'yyyy-MM-dd',
            valueFormat: 'yyyy-MM-dd',
            type:'date',
            search: false
          }, {
            hide: false,
            label: '结束时间',
            prop: 'endTime',
            format: 'yyyy-MM-dd',
            valueFormat: 'yyyy-MM-dd',
            type:'date',
            search: false
          }]},
        this.dialogOption={
          submitBtn:false,
          emptyBtn:false,
          group:[
            {
              icon:'',
              label: '',
              // collapse:false,
              prop: 'group1',
              column: [{
                label: '部门',
                width: 70,
                prop: 'deptName',
                search: false,
                hide: false,
                disabled : true,
                type:'input',
              },{
                label: '线路',
                prop: '$lineCode',
                type: 'input',
                width:250,
                disabled : true,
              },{
                label: '站点',
                prop: '$stationCode',
                type: 'input',
                width:250,
                disabled : true,
              },{
                label: '发单时间',
                prop: 'transactionTime',
                format: 'yyyy-MM-dd',
                valueFormat: 'yyyy-MM-dd',
                width: 75,
                type: 'date',
                hide: false,
                disabled: true
              },{
                label: '要求回复时间',
                prop: 'hopeReturnTime',
                format: 'yyyy-MM-dd',
                valueFormat: 'yyyy-MM-dd',
                width: 120,
                type: 'date',
                hide: false,
                disabled: true
              },{
                hide: false,
                label: '事务类型',
                prop: 'transactionType',
                disabled : true,
                type: 'select',
		dicData:getMappingStatusArray('TRANSACTION_TYPE'),
		rules: [
		  {
		    required: true,
		    message: "请选择事务类型"
		  }
		]
              },{
                hide: false,
                label: '车站上传附件',
                prop: 'stationFile',
                type: "upload",
                component: "zd-upload",
                dataType: "string",
                width: 120,
                disabled: this.showType==true,
                search: false,
                display: this.showType==true
              }, {
                hide: false,
                label: '线路上传附件',
                prop: 'lineFile',
                type: "upload",
                component: "zd-upload",
                dataType: "string",
                width: 120,
                disabled: this.showType==true,
                search: false
              },
              // {
              //   hide: true,
              //   display: false,
              //   label: '车站上传附件',
              //   prop: 'stationFile',
              //   type: 'upload',
              //   loadText: '附件上传中，请稍等',
              //   propsHttp: {
              //     name: 'name',
              //     url: 'url',
              //     fileName: 'file',
              //     res: 'data'
              //   },
              //   action: '/admin/sys-file/upload',
              //   width: 120,
              //   disabled: false,
              //   search: false
              // }, {
              //   hide: true,
              //   display: false,
              //   label: '线路上传附件',
              //   prop: 'lineFile',
              //   type: 'upload',
              //   loadText: '附件上传中，请稍等',
              //   propsHttp: {
              //     name: 'name',
              //     url: 'url',
              //     fileName: 'file',
              //     res: 'data'
              //   },
              //   action: '/admin/sys-file/upload',
              //   width: 120,
              //   disabled: false,
              //   search: false
              // },
              {
                hide: false,
                width: 70,
                label: '反馈人',
                prop: 'returnCreatorName',
                type: 'input',
                formslot: true,
                slot: true,
                disabled: true,
                search: false
              }, {
                hide: false,
                label: '反馈人工号',
                prop: 'returnCreatorCode',
                width: 100,
                formslot: true,
                slot: true,
                disabled: true,
                search: false
              },{
                hide: false,
                label: '反馈时间',
                prop: 'returnTime',
                format: 'yyyy-MM-dd',
                valueFormat: 'yyyy-MM-dd',
                type:'date',
                disabled: true,
                search: false
              },{
                label: '申请原因',
                width: 100,
                prop: 'applyCase',
                disabled : true,
                type:'textarea',
              },{
                label: '车站排查经过及结果',
                width: 180,
                prop: 'applyDetail',
                search: false,
                hide: false,
                disabled: true,
                type:'textarea'
              },{
                label: '反馈结果',
                width: 100,
                prop: 'returnData',
                search: false,
                hide: true,
                disabled: true,
                type:'textarea'
              }]
            },
          ]
        } ;
        if(1 == type){
          this.dialogOption.group[0].column[9].disabled = false;
          this.dialogOption.group[0].column[10].disabled = false;
          this.dialogOption.group[0].column[13].disabled = false;
        }
      },
      getList() {
        this.listLoading = true;
        this.page.size = this.page.pageSize;
        this.page.current = this.page.currentPage;
        Object.assign(this.searchForm, this.page);
        this.searchForm.userCode = this.$store.getters.userInfo.userCode;
        getSwStApplyNetworkCheckPassengerAffairs(this.searchForm).then((response)=>{
          this.list = response.data.data.records;
          this.listLoading = false;
          this.page.total = response.data.data.total;
        });
      },
      handleFilter(params, done) {
        Object.assign(this.searchForm,params);
        this.getList()
        done()
      },
      selectionChange(list){
        this.selectKeys=list;
        this.selectKeyVals=[];
        this.selectKeyValData=[];
        for(let i=0;i<list.length;i++){
          this.selectKeyValData.push(list[i]);
          this.selectKeyVals.push(list[i].id);
        }
      }
    }
  }
</script>
<style lang="scss">
</style>
